// 这是入口文件，也是webpack需要打包的文件入口
// 导入vue
import Vue from 'vue'
import VueRouter from 'vue-router'
import VueResource from 'vue-resource'
import Vuex from 'vuex';

//import { Header, Swipe, SwipeItem, Button, Lazyload } from 'mint-ui'
import MintUI from 'mint-ui'
import 'mint-ui/lib/style.css'

import './lib/mui/dist/css/mui.css'
import './lib/mui/dist/css/icons-extra.css'

import './lib/css/global.scss'

import router from './router.js'

// 按需导入会导致lazyload的加载图标无法出现
// Vue.use(Lazyload)
// Vue.component(Header.name, Header)
// Vue.component(Swipe.name, Swipe)
// Vue.component(SwipeItem.name, SwipeItem)
// Vue.component(Button.name, Button)
Vue.use(MintUI)

// 图片预览插件
import VuePreview from 'vue-preview'
// defalut install
//Vue.use(VuePreview)
// with parameters install
Vue.use(VuePreview, {
  mainClass: 'pswp--minimal--dark',
  barsSize: { top: 0, bottom: 0 },
  captionEl: false,
  fullscreenEl: false,
  shareEl: false,
  bgOpacity: 0.85,
  tapToClose: true,
  tapToToggleControls: false
})


import app from './App.vue'

Vue.use(VueRouter)
Vue.use(VueResource)
Vue.http.options.root = 'http://localhost:3003/'
Vue.http.options.emulateJSON = true

import moment from 'moment'
Vue.filter('dateFormat', function (datestr, format = 'YYYY-MM-DD') {
  return moment(datestr).format(format)
})

// 注册统一状态管理
Vue.use(Vuex)
// 先从localstroage中尝试去取数据
var car = JSON.parse(localStorage.getItem('shopCar') || '[]')
// 创建一个stroe
const store = new Vuex.Store({
  state: {
    shopCar: car       // 存放购物车数据
  },
  mutations: {
    addToShopCar(state, goodsinfo) {
      var flag = false
      console.log(state.shopCar)
      state.shopCar.forEach((item, index) => {
        if (item.id == goodsinfo.id) {
          state.shopCar[index].count += parseInt(goodsinfo.count)
          state.shopCar[index].price = goodsinfo.price
          flag = true
          return
        }
      })
      if (flag === false) {
        state.shopCar.push(goodsinfo)
      }
      // 将数据暂存到localstorage
      localStorage.setItem('shopCar', JSON.stringify(state.shopCar))
    },
    editShopCarGoodsCount(state, info) {
      state.shopCar.forEach((item, index) => {
        if (info.id == item.id) {
          state.shopCar[index].count = parseInt(info.count)
          return;
        }
      })
      // 将数据暂存到localstorage
      localStorage.setItem('shopCar', JSON.stringify(state.shopCar))
    },
    deleteShopCarGoodsById(state, id) {
      state.shopCar.some((item, i) => {
        if (item.id == id) {
          state.shopCar.splice(i, 1)
          return true
        }
      })
      // 将数据暂存到localstorage
      localStorage.setItem('shopCar', JSON.stringify(state.shopCar))
    },
    updateShopCarSelectState(state, select) {
      state.shopCar.forEach((item, index) => {
        if (item.id == select.id) {
          state.shopCar[index].selected = select.status
          return
        }
      })
      // 将数据暂存到localstorage
      localStorage.setItem('shopCar', JSON.stringify(state.shopCar))
    }
  },
  getters: {
    getAllCount(state) {
      var ret = 0
      state.shopCar.forEach(item => {
        ret += item.count
      })
      return ret
    },
    getIdCountList(state) {
      var list = {}
      state.shopCar.forEach(item => {
        list[item.id] = item.count
      })
      return list
    },
    getGoodsSelect(state) {
      var list = {}
      state.shopCar.forEach(item => {
        list[item.id] = item.selected
      })
      return list
    },
    getShopCarCountAndPrice(state) {
      var obj = {
        count: 0,
        price: 0
      }
      state.shopCar.forEach(item => {
        if (item.selected === true) {
          obj.count += parseInt(item.count)
          obj.price+= parseInt(item.price)
        }
      })
      return obj
    }
  }
})


var vm = new Vue({
  el: '#app',
  render: (createElemnt) => {
    return createElemnt(app)
  },
  router: router,
  store: store       // 挂载之后所有组件都能访问到
})